<template>
	<view class="content">
		<view class="back" @click="back()">
			<image src="../../static/homeimages/more.png"></image>
		</view>
		<view class="search">
			<image src="../../static/homeimages/sea.png"></image>
			<input type="text" placeholder="地方特产" />
		</view>
		<view class="nav">
			<text>全部</text>
			<text>一方人</text>
			<text>农掌柜</text>
		</view>
		<view>
			<view class="commodity">
			<view>
				<image src="../../static/Local_specialty/huangba.jpg"></image>
				</view>
			<text>黄糍粑</text>
			<text>￥55.00</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
</script>

<style>
	.content {
		width: 100%;
		height: 100vh;
		padding-top: 50rpx;
		background-color: #e0e3e0;
	}

	.back {
		width: 75rpx;
		height: 75rpx;
		margin-left: 40rpx;
	}

	.back image {
		width: 100%;
		height: 100%;
		transform: rotateY(180deg);
	}

	.search {
		width: 620rpx;
		height: 65rpx;
		border-radius: 30rpx;
		background-color: #eff0ef;
		margin: 0 auto;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.search image {
		width: 40rpx;
		height: 40rpx;

	}

	.search input {
		/* width: 100%; */

	}
	.nav{
		display: flex;
		justify-content: space-around;
		margin: 40rpx 0;
		
	}
	.nav text{
		font-size: 40rpx;
	}
	
	.commodity{
		width: 230rpx;
		height: 330rpx;
		background-color: #f0f1f1;
		padding: 4rpx;
	
	}
	.commodity view{
		width: 100%;
		height: 246rpx;
		
	}
	.commodity view image{
		width: 100%;
		height: 100%;
	}
	.commodity text{
		padding-left: 10rpx;
		margin-top: 3rpx;
		display: block;
		line-height: 40rpx;
	}
	.commodity text:nth-child(3){
		color: #da161b;
	}
</style>